<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="https://d3js.org/d3.v4.min.js"></script>

</head>
<body>
	<p>This's test1</p>
	<p>This's test2</p>
	<p>This's test3</p>
	<p>This's test4</p>

	<script type="text/javascript">
		
		d3.select("body").style("background-color", "red");

/*		d3.selectAll("p").style("color", function () {
			return "hsl(" + Math.random() * 360 + ", 100%,50%)";
		});*/

/*		d3.selectAll("p").style("color", function (d, i) {
			return i % 2 ? "#fff" : "#000";
		});*/

		d3.selectAll("p")
			.data([5, 15, 25, 35, 45]).enter().append("p").text(function(d, i) {return "This's test" + (i + 1);});

		d3.selectAll("p")
			.style("font-size", function (d, i) {
				return d + "px";
		});
	</script>
</body>
</html>